@import "common.scss";

// 头部公共部分
.s-header{
    width: 100%;
    height: 40px;
    background-color: #de2810;
    .header-wrap{
        @include typeArea();
        height: 100%;
        // background-color: pink;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .header-l{
            width: 297px;
            height: 40px;           
            .nl-li{
                float: left;
                margin-right: 20px;
                line-height: 40px;
                a{
                    font: $font2;
                    color: $cool;
                }
            }
        }
        .nav-r{
            height: 40px;
            .nr-li{
                float: left;
                margin-left: 20px;
                line-height: 40px;
                a{
                    font: $font2;
                    color: $cool;
                }
            }
        }
    }
}
.navwrap{
    width: 100%;
    height: 102px;
.navwrapper{
        @include typeArea();
        height: 100%;
        // background-color: aqua;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .navsearch-l{
            .logo{
                width: 180px;
                height: 36px;
                vertical-align: middle;
                margin-right: 40px;
            }
            span{
                font-size: 18px;
                color: #333;
                margin-right: 50px;
            }
        }
       
}
}

// 内容
.contentWrap{
	background-color: #f2f2f2;
	overflow: hidden;
	.tableCar{
		width: 1020px;
		margin: 0 auto;
		margin-top: 20px;
		background-color: #fff;
		padding-left: 10px;
		// padding-top: 15px;
		color: rgba(51,51,51,1);
    font-size: 14px;
    font-family: SourceHanSansCN-Bold,SourceHanSansCN;
    text-align: center;
		thead{
			font-weight: 700;
			border-bottom: 1px solid #999;
			margin-bottom: 5px;
			tr{
				height: 50px;
			}
		}
		.tableList{
			tr{
				height: 104px;
				// display: inline-block;
				// border-bottom: 1px solid rgb(194, 189, 189);
				.checkbox{
					line-height: 104px;
					position: relative;
					text-align: center;
					width: 60px;
					.checkone{
						cursor: pointer;
						display: inline-block;
						height: 13px;
						vertical-align: middle;
						width: 13px;
					}
				}
				.goods{
					text-align: left;
					width: 350px;
					height: 104px;
					img{
						border: 1px solid #ddd;
						border-radius: 5px;
						height: 68px;
						width: 68px;
						vertical-align: middle;
						float: left;
						margin-right: 15px;
					}
					span{
						color: #333;
						display: inline-block;
						width: 250px;
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						text-overflow: ellipsis;
						float: left;
					}
				}
				.price{
					width: 117px;
					height: 104px;
				}
				.count{
					width: 102px;
					height: 104px;
					.mod-modifier{
						border: 1px solid rgba(221,221,221,1);
						height:28px;
						width: 96px;
						margin: 0 auto;
						// text-align: center;
						.reduce,.add,.count-input{
							float: left;
						}
						.reduce,.add{
							height: 100%;
							width: 20px;
							text-align: center;
						}
						.reduce{
							width: 27px;
							border-right: 1px solid rgba(221,221,221,1);
						}
						.add{
							border-left:1px solid rgba(221,221,221,1);
						}
						.count-input{
							width: 37px;
							height: 100%;
							text-align: center;
						}
						
					}
				}
				.subtotal{
					width: 109px;
					height: 104px;
					color: #f33;
					line-height: 104px;
					text-align: center;
					margin-left: 5px;
				}
				.operation{
					.delete{
						cursor: pointer;
					}
				}
			}
		}
	}
	.stat{
		border: 1px solid #eaebec;
		font-size: 14px;
		height: 70px;
		line-height: 70px;
		margin-top: 15px;
		position: relative;
		text-indent: 10px;
		width: 1020px;
		margin: 0 auto;
		.fl{
			color: #333;
		}
		.selected{
			color: #333;
			position: absolute;
			right:380px;
			top:0;
			height: 70px;
			line-height: 70px;
			#selectedTotal{
				color: #ff3333;
			}
		}
		.total{
			position: absolute;
			right: 260px;
			top: 0;
			height: 70px;
			line-height: 70px;
			color: #ff3333;
			font-weight: 700;
		}
		.closing{
			position: absolute;
			right:30px;
			text-align: center;
			top: 10px;
			width: 160px;
			height: 50px;
			line-height: 50px;
			background: linear-gradient(180deg,rgba(255,51,51,1) 0,rgba(255,102,51,1) 100%);
			border-radius: 6px;
			color: #fff;
			cursor: pointer;
			font-size: 20px;
		}
	}
}


// 底部公共部分
.footer-top{
	
	min-height: 350px;
	background-color: #fff;
	color: #333;
	padding: 60px 0;
	.ftWrap{
		@include typeArea();
		.aboutbox{
			width: 320px;
			float: left;
			margin-right: 100px;
			.helpTitle{
				font-size: 18px;
				color: #333;
				line-height: 30px;
				font-weight: 700;
				margin-bottom: 27px;
			}
			.helpText{
				font-size: 14px;
				line-height: 24px;
				margin-bottom: 6px;
				// border-bottom: 1px solid #333;
			}
		}
		.linkbox{
			float: left;
    		margin-right: 100px;
    		text-align: left;
			margin-right: 100px;
			.helpTitle{
				font-size: 18px;
				color: #333;
				line-height: 30px;
				font-weight: 700;
				margin-bottom: 27px;
			}
			a{
				display: block;
    			font-size: 14px;
    			line-height: 24px;
				color: #666;
    			margin-bottom: 6px;
			}
		}
		.contentbox{
			border-left: 1px solid #979797;
    		float: right;
    		min-height: 230px;
    		text-align: center;
    		width: 300px;
			.helpTitle{
				font-size: 18px;
				color: #333;
				line-height: 30px;
				font-weight: 700;
				margin-bottom: 27px;
			}
			.bigText{
				font-weight: 700;
    			font-size: 28px;
    			line-height: 30px;
			}
			.smallText{
				color: #999;
    			font-size: 14px;
    			line-height: 30px;
			}
		}
	}
}
.footer-bottom{
	background: #333;
	color: #fff;
	.fbWrap{
		@include typeArea();
		.fbtBox{
			@include typeArea();
			// margin-left: 200px;
			text-align: center;
			height: 80px;
			// border-bottom: 1px solid #666;
  			padding: 25px 0;
			  a{
				color: #fff;
				display: inline-block;
				font-size: 24px;
				line-height: 30px;
				margin-right: 150px;
				vertical-align: top;
				span{
					font: inherit;
				}
			  }
		}
		.fbBbox{
			font-size: 14px;
    		line-height: 20px;
    		padding: 18px 0 21px;
    		text-align: center;
			.fb-top{
				color: #fff;
			}
			.fb-bottom{
				color: rgba(255,255,255,.5);
				 font-size: 12px;
			}
		}
	}
}